<!-- head - 开始 -->
<? require(dirname(dirname(__FILE__)).'/public/head.html'); ?>
<!-- head - 结束 -->

</head>
<? require(dirname(dirname(__FILE__)).'/public/body.html'); ?>
    <div class="wrapper" id="profile">
        
        <!-- 侧边栏 - 开始 -->
        <i-left-side></i-left-side>
        <!-- 侧边栏 - 结束 -->
        
        <div class="content-page">
            
            <div class="content">
                
                <!-- 顶部导航 - 开始 -->
                <i-top-nav></i-top-nav>
                <!-- 顶部导航 - 结束 -->
                
                <!-- 内容 - 开始 -->
                <div class="container-fluid">
                
                    <!-- 页面标题 开始 -->
                    <div class="row">
                        <div class="col-12">
                            <div class="page-title-box">
                                <div class="page-title-right">
                                    <form class="form-inline">
                                        <div class="form-group">
                                            <div class="input-group">
                                                <input type="text" class="form-control form-control-light" id="dash-daterange">
                                                <div class="input-group-append">
                                                    <span class="input-group-text bg-primary border-primary text-white">
                                                        <i class="mdi mdi-calendar-range font-13"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div>
                                        <a href="/index/profile" class="btn btn-primary ml-2">
                                            <i class="mdi mdi-autorenew"></i>
                                        </a>
                                    </form>
                                </div>
                                <h4 class="page-title">个人资料</h4>
                            </div>
                        </div>
                    </div>
                    <!-- 页面标题 结束 -->
                
                
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="card bg-primary">
                                <div class="card-body profile-user-box">
                
                                    <div class="row">
                                        <div class="col-sm-8">
                                            <div class="media">
                                                <span class="float-left m-2 mr-4">
                                                    <a :href="login_account.address_url" target="_blank">
                                                        <img :src="login_account.head_img" style="height: 100px;" :alt="login_account.description" class="rounded-circle img-thumbnail">
                                                    </a>
                                                </span>
                                                <div class="media-body">
                
                                                    <h4 class="mt-1 mb-1 text-white">{{login_account.nickname}}</h4>
                                                    <p class="font-13 text-white-50">{{login_account.description}}</p>
                
                                                    <ul class="mb-0 list-inline text-light">
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">5482</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的文章</p>
                                                        </li>
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">25,184</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的评论</p>
                                                        </li>
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">25,184</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的访客</p>
                                                        </li>
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">2184</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的访客</p>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                
                                        <div class="col-sm-4">
                                            <div class="text-center mt-sm-0 mt-3 text-sm-right">
                                                <a href="/index/EditProfile" class="btn btn-light">
                                                    <i class="mdi mdi-account-edit mr-1"></i> 编辑资料
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                
                                </div>
                            </div>
                        </div>
                    </div>
                
                    <div class="row">
                        <div class="col-md-4">
                            <div class="card">
                                <div class="card-body">
                                    <h4 class="header-title mt-0 mb-3">个人资料</h4>
                                    <p class="text-muted font-13">
                                        对个人资料的简单描述，暂时只是个占位符！
                                    </p>
                
                                    <hr/>
                
                                    <div class="text-left">
                                        <p class="text-muted"><strong>用户名：</strong> <span class="ml-2">{{login_account.nickname}}</span></p>
                
                                        <p class="text-muted"><strong>Mobile :</strong><span class="ml-2">(+12) 123 1234 567</span></p>
                
                                        <p class="text-muted"><strong>邮箱：</strong> <span class="ml-2">{{login_account.email}}</span></p>
                
                                        <p class="text-muted"><strong>Location :</strong> <span class="ml-2">USA</span></p>
                
                                        <p class="text-muted"><strong>主页地址：</strong>
                                            <span class="ml-2">{{login_account.address_url}}</span>
                                        </p>
                                        <p class="text-muted mb-0"><strong>联系方式：</strong>
                                            <a class="d-inline-block ml-2 text-muted" title="" data-placement="top" data-toggle="tooltip" href="" data-original-title="Facebook"><i class="mdi mdi-facebook"></i></a>
                                            <a class="d-inline-block ml-2 text-muted" title="" data-placement="top" data-toggle="tooltip" href="" data-original-title="Twitter"><i class="mdi mdi-twitter"></i></a>
                                            <a class="d-inline-block ml-2 text-muted" title="" data-placement="top" data-toggle="tooltip" href="" data-original-title="Skype"><i class="mdi mdi-skype"></i></a>
                                        </p>
                
                                    </div>
                                </div>
                            </div>
                
                            <div class="card text-white bg-info overflow-hidden">
                                <div class="card-body">
                                    <div class="toll-free-box text-center">
                                        <h4> <i class="mdi mdi-deskphone"></i> Toll Free : 1-234-567-8901</h4>
                                    </div>
                                </div>
                            </div>
                
                            <div class="card">
                                <div class="card-body">
                                    <h4 class="header-title mb-3">Messages</h4>
                
                                    <div class="inbox-widget">
                                        <div class="inbox-item">
                                            <div class="inbox-item-img"><img src="assets/images/logo-2.png" class="rounded-circle" alt=""></div>
                                            <p class="inbox-item-author">Tomaslau</p>
                                            <p class="inbox-item-text">I've finished it! See you so...</p>
                                            <p class="inbox-item-date">
                                                <a href="#" class="btn btn-sm btn-link text-info font-13"> Reply </a>
                                            </p>
                                        </div>
                                        <div class="inbox-item">
                                            <div class="inbox-item-img"><img src="assets/images/logo-2.png" class="rounded-circle" alt=""></div>
                                            <p class="inbox-item-author">Stillnotdavid</p>
                                            <p class="inbox-item-text">This theme is awesome!</p>
                                            <p class="inbox-item-date">
                                                <a href="#" class="btn btn-sm btn-link text-info font-13"> Reply </a>
                                            </p>
                                        </div>
                                        <div class="inbox-item">
                                            <div class="inbox-item-img"><img src="assets/images/logo-2.png" class="rounded-circle" alt=""></div>
                                            <p class="inbox-item-author">Kurafire</p>
                                            <p class="inbox-item-text">Nice to meet you</p>
                                            <p class="inbox-item-date">
                                                <a href="#" class="btn btn-sm btn-link text-info font-13"> Reply </a>
                                            </p>
                                        </div>
                
                                        <div class="inbox-item">
                                            <div class="inbox-item-img"><img src="assets/images/logo-2.png" class="rounded-circle" alt=""></div>
                                            <p class="inbox-item-author">Shahedk</p>
                                            <p class="inbox-item-text">Hey! there I'm available...</p>
                                            <p class="inbox-item-date">
                                                <a href="#" class="btn btn-sm btn-link text-info font-13"> Reply </a>
                                            </p>
                                        </div>
                                        <div class="inbox-item">
                                            <div class="inbox-item-img"><img src="assets/images/logo-2.png" class="rounded-circle" alt=""></div>
                                            <p class="inbox-item-author">Adhamdannaway</p>
                                            <p class="inbox-item-text">This theme is awesome!</p>
                                            <p class="inbox-item-date">
                                                <a href="#" class="btn btn-sm btn-link text-info font-13"> Reply </a>
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                
                        </div>
                
                        <div class="col-md-8">
                
                            <div class="card">
                                <div class="card-body">
                                    <h4 class="header-title mb-3">Orders & Revenue</h4>
                                    <div style="height: 260px;" class="chartjs-chart">
                                        <canvas id="high-performing-product"></canvas>
                                    </div>
                                </div>
                            </div>
                
                            <div class="row">
                                <div class="col-sm-4">
                                    <div class="card tilebox-one">
                                        <div class="card-body">
                                            <i class="dripicons-basket float-right text-muted"></i>
                                            <h6 class="text-muted text-uppercase mt-0">Orders</h6>
                                            <h2 class="m-b-20">1,587</h2>
                                            <span class="badge badge-primary"> +11% </span> <span class="text-muted">From previous period</span>
                                        </div>
                                    </div>
                                </div>
                
                                <div class="col-sm-4">
                                    <div class="card tilebox-one">
                                        <div class="card-body">
                                            <i class="dripicons-box float-right text-muted"></i>
                                            <h6 class="text-muted text-uppercase mt-0">Revenue</h6>
                                            <h2 class="m-b-20">$<span>46,782</span></h2>
                                            <span class="badge badge-danger"> -29% </span> <span class="text-muted">From previous period</span>
                                        </div>
                                    </div>
                                </div>
                
                                <div class="col-sm-4">
                                    <div class="card tilebox-one">
                                        <div class="card-body">
                                            <i class="dripicons-jewel float-right text-muted"></i>
                                            <h6 class="text-muted text-uppercase mt-0">Product Sold</h6>
                                            <h2 class="m-b-20">1,890</h2>
                                            <span class="badge badge-primary"> +89% </span> <span class="text-muted">Last year</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                
                            <div class="card">
                                <div class="card-body">
                                    <h4 class="header-title mb-3">My Products</h4>
                
                                    <div class="table-responsive">
                                        <table class="table table-hover table-centered mb-0">
                                            <thead>
                                            <tr>
                                                <th>Product</th>
                                                <th>Price</th>
                                                <th>Stock</th>
                                                <th>Amount</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr>
                                                <td>ASOS Ridley High Waist</td>
                                                <td>$79.49</td>
                                                <td><span class="badge badge-primary">82 Pcs</span></td>
                                                <td>$6,518.18</td>
                                            </tr>
                                            <tr>
                                                <td>Marco Lightweight Shirt</td>
                                                <td>$128.50</td>
                                                <td><span class="badge badge-primary">37 Pcs</span></td>
                                                <td>$4,754.50</td>
                                            </tr>
                                            <tr>
                                                <td>Half Sleeve Shirt</td>
                                                <td>$39.99</td>
                                                <td><span class="badge badge-primary">64 Pcs</span></td>
                                                <td>$2,559.36</td>
                                            </tr>
                                            <tr>
                                                <td>Lightweight Jacket</td>
                                                <td>$20.00</td>
                                                <td><span class="badge badge-primary">184 Pcs</span></td>
                                                <td>$3,680.00</td>
                                            </tr>
                                            <tr>
                                                <td>Marco Shoes</td>
                                                <td>$28.49</td>
                                                <td><span class="badge badge-primary">69 Pcs</span></td>
                                                <td>$1,965.81</td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                
                    </div>
                
                </div>
                <!-- 内容 - 结束 -->
                
            </div>
            
            <!-- 页脚 - 开始 -->
            <i-footer></i-footer>
            <!-- 页脚 - 结束 -->
        </div>
        
        <!-- 右侧边栏 - 开始 -->
        <i-right-side></i-right-side>
        <!-- 右侧边栏 - 结束 -->
    </div>
    
    <script src="<?= __ADMIN_JS__.'vue/profile.js?v='.__VERSION__; ?>"></script>
    
    <!-- 依赖 - 开始 -->
    <? require(dirname(dirname(__FILE__)).'/public/script.html'); ?>
    <!-- 依赖 - 结束 -->
    
    <!-- APP JS - 开始 -->
    <!-- APP JS - 结束 -->
    
    <!-- footer - 开始 -->
    <? require(dirname(dirname(__FILE__)).'/public/footer.html'); ?>
    <!-- footer - 结束 -->